<template>
  <view class="todo-col" @click="handleClick()">
    <view class="todo-item">
      <view class="todo-label">
        <image src="/static/images/message/icon-tip.png" class="icon-tip"></image>
        <view>
          <view>{{ label }}</view>
          <view class="count-control">
            <text class="count">{{ count }}</text>
            <text style="color: #999999; font-size: 26rpx">条待办</text>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>
<script>
export default {
  props: {
    count: {
      type: [String, Number]
    },
    label: [String]
  },
  methods: {
    handleClick() {
      this.$emit('click')
    }
  }
}
</script>
<style lang="scss" scoped>
.todo-col {
  width: 50%;
  padding: 0 15rpx;
  margin-bottom: 30rpx;
}
.todo-item {
  height: 150rpx;
  background: #f9fafd;
  border-radius: 20rpx;
  padding: 30rpx 20rpx;
}
.todo-label {
  display: flex;
  justify-content: start;
  align-items: start;
  font-weight: 400;
  font-size: 30rpx;
  color: #333333;
  text-align: left;
}
.icon-tip {
  height: 40rpx;
  width: 40rpx;
  margin-right: 8rpx;
}
.count-control {
  margin-top: 10rpx;
}
.count {
  font-size: 40rpx;
  color: #ff561e;
  font-weight: 500;
}
</style>
